<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="apple-mobile-web-app-capable" content="yes" />
		<meta name="apple-touch-fullscreen" content="yes" />
		<meta name="format-detection" content="telephone=no"/>
		<meta name="apple-mobile-web-app-status-bar-style" content="black" /> 
		<meta name="msapplication-tap-highlight" content="no" />
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=device-width, viewport-fit=cover" />
		<title>启蒙优选-我的团队</title>
		<link rel="stylesheet" href="../css/style.css" />
	</head>
	<body>
		<!-- 我的团队 --> 
		<div class="teamIndex">
			<div class="promotionBg"></div>
			<div class="content">
				<div class="userBox">
					<div class="number">
						<h3>99<i>人</i></h3>
						<p>团队人数</p>
					</div>
					<!-- 有邀请人 -->
					<div class="user_info flex juscbtween hide">
						<div class="left flex alitemCenter">
							<img src="../img/head.jpeg" alt="">
							<div class="user_aname">
								<div class="name">我的邀请人：花</div>
								<p>累计收益7777元</p>
							</div>
						</div>
						<a href="" class="flex alitemCenter"><span>联系TA</span><img src="../img/right_jin.png" alt=""></a>
					</div>
					<!-- 无邀请人 -->
					<div class="user_info flex juscbtween">
						<div class="left flex alitemCenter">
							<img src="../img/head.jpeg" alt="">
							<div class="user_aname">
								<div class="name">未绑定邀请人</div>
							</div>
						</div>
						<a href="javascript:;" class="flex alitemCenter gobindButton"><span>去绑定</span><img src="../img/right_jin.png" alt=""></a>
					</div>
				</div>
				<div class="team_tab flex juscenter">
					<div class="tab_item on">直属（99）</div>
					<div class="tab_item">扩散（99）</div>
					<div class="tab_item">预绑定（99）</div>
				</div>
				<!-- 团队列表 -->
				<div class="team_list">
					<div class="team_item flex juscbtween">
						<div class="left flex alitemCenter">
							<img src="../img/head.jpeg" alt="">
							<div class="user_aname">
								<div class="name"><i>HolmeJun-</i><span>普通会员</span></div>
								<p>2020-20-20 10:12:12</p>
							</div>
						</div>
						<a href="javascript:;" class="flex alitemCenter contactFriend"><span>联系TA</span><img src="../img/right.png" alt=""></a>
					</div>
					<div class="team_item flex juscbtween">
						<div class="left flex alitemCenter">
							<img src="../img/head.jpeg" alt="">
							<div class="user_aname">
								<div class="name"><i>HolmeJun-</i><span>普通会员</span></div>
								<p>2020-20-20 10:12:12</p>
							</div>
						</div>
						<a href="javascript:;" class="flex alitemCenter contactFriend"><span>联系TA</span><img src="../img/right.png" alt=""></a>
					</div>
				</div>
				<!-- 绑定邀请人弹框 -->
				<div class="bindInvitionMask close">
					<div class="bindInvitionBox bubbling">
						<div class="bindTitle">绑定邀请人</div>
						<div class="bindInput">
							<input type="text" placeholder="请输入邀请码" id="invitionNumber" />
						</div>
						<div class="bindUser">
							<div class="hide flex alitemCenter userInfo">
								<img src="../img/head.jpeg" alt="" class="shareImg">
								<div class="bindInfo">
									<p class="shareName">君</p>
									<span>邀请你加入养猫联盟</span>
								</div>
							</div>
						</div>
						<div class="bindButton cur">查询邀请人</div>
						<img src="../img/close.png" class="close" alt="">
					</div>
				</div>
				<!-- 联系弹框 -->
				<div class="contactMask close">
					<div class="contactBox bubbling">
						<div class="user_info">
							<img src="../img/head.jpeg" alt="" class="head">
							<div class="user_member">
								<span>联合创始人</span>
								<h3>君</h3>
								<p>微信号：<i id="_order_umber">55725836</i> <img src="../img/copy.png" alt="" id="copyOrderNum"></p>
							</div>
						</div>
						<div class="contactMoney">
							<div class="flex juscbtween">
								<div class="item">
									<p>本月预估收益</p>
									<h3><i>￥</i>888</h3>
								</div>
								<div class="item">
									<p>累计预估收益</p>
									<h3><i>￥</i>888</h3>
								</div>
							</div>
							<div class="flex juscbtween">
								<div class="item">
									<p>本月预估收益</p>
									<h3><i>￥</i>888</h3>
								</div>
								<div class="item">
									<p>累计预估收益</p>
									<h3><i>￥</i>888</h3>
								</div>
							</div>
						</div>
						<div class="time">2020-02-02 12:12:21 注册</div>
						<img src="../img/close.png" class="close" alt="">
					</div>
				</div>
			</div>
		</div>
	</body>
	<script rel="stylesheet" src="../js/jquery-2.0.3.min.js"></script>
	<script rel="stylesheet" src="../js/layer/layer.js"></script>
	<script>
		$(function(){
			//显示绑定弹框
			$('.gobindButton').click(function(){
				$('.bindInvitionMask').show();
			})

			//隐藏所有弹框
			$('.close').click(function(){
				$('.bindInvitionMask').hide();
				$('.contactMask').hide();
			})

			//冒泡，禁止点击
			$('.bubbling').click(function(){
				return false;
			})

			//显示联系弹框
			$('body').on('click','.contactFriend',function(){
				$('.contactMask').show();
			})

			//复制邀请码
		   	$('#copyOrderNum').on('click', function () {
			    var val = document.getElementById('_order_umber');
			    window.getSelection().selectAllChildren(val);
			    var copyCode = document.execCommand("Copy");

			    if (copyCode) {
			      layer.msg('复制成功');
			    } else {
			      layer.msg('复制失败');
			    }
			});

			//输入邀请人id时触发
			$('#invitionNumber').on('input', function (e) {
				$('.bindButton').addClass('haveInput');
			}); 
		})
	</script>
</html>
